<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>SpaceMax | Multi Purpose HTML Template</title>

<link rel="icon" type="image/png" sizes="32x32" href="favicon.png">

<link href="fonts/sfuidisplay.css" rel="stylesheet">

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css">

<link rel="stylesheet" href="css/plugins.min.css">

<link rel="stylesheet" href="css/app.css">

<link rel="stylesheet" href="css/custom.css">
</head>
<body class="theme-royal-blue" data-spy="scroll" data-target="#navbar-nav" data-animation="true" data-appearance="light">

<div class="switcher">
<div class="switcher__toggler d-flex flex-column align-items-center justify-content-center">
<button class="toggler__btn mb-1">
<img src="demo-assets/settings.png" alt="settings">
</button>
</div>
<div class="switcher-wrapper">

<div class="switcher-colors switcher-clone">
<h4 class="switcher__item-title">Change the color style</h4>
<ul class="switcher-tab">
<li class="switcher-tab__item">
<button class="tab-color active">Solid Colors</button>
</li>
<li class="switcher-tab__item">
<button class="tab-gradient">Gradient Colors</button>
</li>
</ul>
<div class="switcher-tab-content switcher-tab__color">
<ul class="switcher-color tab-color-clone active">
<li>
<button data-theme="theme-royal-blue" class="controller theme-royal-blue active"></button>
</li>
<li>
<button data-theme="theme-blue" class="controller theme-blue"></button>
</li>
<li>
<button data-theme="theme-amethyst" class="controller theme-amethyst"></button>
</li>
<li>
<button data-theme="theme-roman" class="controller theme-roman"></button>
</li>
<li>
<button data-theme="theme-amaranth" class="controller theme-amaranth"></button>
</li>
<li>
<button data-theme="theme-orange" class="controller theme-orange"></button>
</li>
<li>
<button data-theme="theme-green" class="controller theme-green"></button>
</li>
<li>
<button data-theme="theme-fern" class="controller theme-fern"></button>
</li>
</ul>
<ul class="switcher-gradient tab-color-clone">
<li>
<button data-theme="theme-gradient-1" class="controller bg-gradient--1"></button>
</li>
<li>
<button data-theme="theme-gradient-2" class="controller bg-gradient--2"></button>
</li>
<li>
<button data-theme="theme-gradient-3" class="controller bg-gradient--3"></button>
</li>
<li>
<button data-theme="theme-gradient-4" class="controller bg-gradient--4"></button>
</li>
<li>
 <button data-theme="theme-gradient-5" class="controller bg-gradient--5"></button>
</li>
<li>
<button data-theme="theme-gradient-6" class="controller bg-gradient--6"></button>
</li>
<li>
<button data-theme="theme-gradient-7" class="controller bg-gradient--7"></button>
</li>
<li>
<button data-theme="theme-gradient-8" class="controller bg-gradient--8"></button>
</li>
</ul>
</div>
</div>


<div class="canvas-style switcher-clone">
<h4 class="switcher__item-title">Canvas style</h4>
<ul class="switcher-tab">
<li class="switcher-tab__item">
<button class="tab-full active">Full </button>
</li>
<li class="switcher-tab__item">
<button class="tab-boxed">Boxed</button>
</li>
</ul>
<div class="switcher-tab-content switcher-tab__pattern">
<ul class="switcher-boxed">
<li>
<button data-theme="circle-pattern" class="pcontroller circle-pattern">
<img class="media__content" src="img/patterns/circle-pattern.png" alt="">
</button>
</li>
<li>
<button data-theme="circles-light" class="pcontroller circles-light">
<img class="media__content" src="img/patterns/circles-light.png" alt="">
</button>
</li>
<li>
<button data-theme="leaf-pattern" class="pcontroller leaf-pattern">
<img class="media__content" src="img/patterns/leaf-pattern.png" alt="">
</button>
</li>
<li>
<button data-theme="memphis-colorful" class="pcontroller memphis-colorful">
<img class="media__content" src="img/patterns/memphis-colorful.png" alt="">
</button>
</li>
<li>
<button data-theme="round-pattern" class="pcontroller round-pattern">
<img class="media__content" src="img/patterns/round-pattern.png" alt="">
</button>
</li>
<li>
<button data-theme="spiration-light" class="pcontroller spiration-light">
<img class="media__content" src="img/patterns/spiration-light.png" alt="">
</button>
</li>
<li>
<button data-theme="swirl-pattern" class="pcontroller swirl-pattern">
<img class="media__content" src="img/patterns/swirl-pattern.png" alt="">
</button>
</li>
<li>
<button data-theme="tic-tac-toe" class="pcontroller tic-tac-toe">
<img class="media__content" src="img/patterns/tic-tac-toe.png" alt="">
</button>
</li>
<li>
<button data-theme="x-pattern" class="pcontroller x-pattern">
<img class="media__content" src="img/patterns/x-pattern.png" alt="">
</button>
</li>
 <li>
<button data-theme="hexagon" class="pcontroller hexagon">
<img class="media__content" src="img/patterns/hexagon.png" alt="">
</button>
</li>
<li>
<button data-theme="curls" class="pcontroller curls">
<img class="media__content" src="img/patterns/curls.png" alt="">
</button>
</li>
<li>
<button data-theme="darkness" class="pcontroller darkness">
<img class="media__content" src="img/patterns/darkness.png" alt="">
</button>
</li>
<li>
<button data-theme="spiration-dark" class="pcontroller spiration-dark">
<img class="media__content" src="img/patterns/spiration-dark.png" alt="">
</button>
</li>
<li>
<button data-theme="zig-zag-wool" class="pcontroller zig-zag-wool">
<img class="media__content" src="img/patterns/zig-zag-wool.png" alt="">
</button>
</li>
</ul>
</div>
</div>


<div class="theme-variation switcher-clone">
<h4 class="switcher__item-title">Landing Pages</h4>
<div class="switcher-tab-content switcher-tab__variation">
<div class="demo-item">
<a href="index.html"><img src="demo-assets/home-1.png" alt="image">
<span>
<i class="fas fa-check"></i>
</span>
</a>
</div>

<div class="demo-item active">
<a href="home-2.html"><img src="demo-assets/home-2.png" alt="image">
<span>
<i class="fas fa-check"></i>
</span>
</a>
</div>

<div class="demo-item">
<a href="home-3.html"><img src="demo-assets/home-3.png" alt="image">
<span>
<i class="fas fa-check"></i>
</span>
</a>
</div>

<div class="demo-item">
<a href="home-4.html"><img src="demo-assets/home-4.png" alt="image">
<span>
<i class="fas fa-check"></i>
</span>
</a>
</div>

<div class="demo-item">
<a href="home-5.html"><img src="demo-assets/home-5.png" alt="image">
<span>
<i class="fas fa-check"></i>
</span>
</a>
</div>

</div>
</div>

</div>
</div>


<div class="preloader">
<div class="wrapper">
<div class="blobs">
<div class="blob-center"></div>
<div class="blob"></div>
<div class="blob"></div>
 <div class="blob"></div>
<div class="blob"></div>
<div class="blob"></div>
<div class="blob"></div>
</div>
<div>
<div class="loader-canvas canvas-left"></div>
<div class="loader-canvas canvas-right"></div>
</div>
</div>
</div>

<main class="main">

<header class="navbar navbar-sticky sticky-bg-color--primary navbar-expand-lg navbar-dark">
<div class="container position-relative">
<a class="navbar-brand" href="index.html">
<img class="navbar-brand__regular" src="img/brand-logo-white.png" alt="brand-logo">
<img class="navbar-brand__sticky" src="img/brand-logo-white.png" alt="sticky brand-logo">
</a>

<button class="navbar-toggler d-lg-none" type="button" data-toggle="navbarToggler" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>

<div class="navbar-inner ml-lg-auto pl-lg-2 pl-xl-6">

<button class="navbar-toggler d-lg-none" type="button" data-toggle="navbarToggler" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>

<nav>
<ul class="navbar-nav" id="navbar-nav">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="javascript:;" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Landing Pages</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="index.html">Home - 1</a>
</li>
<li>
<a class="dropdown-item" href="home-2.html">Home - 2</a>
</li>
<li>
<a class="dropdown-item" href="home-3.html">Home - 3</a>
</li>
<li>
<a class="dropdown-item" href="home-4.html">Home - 4</a>
</li>
<li>
<a class="dropdown-item" href="home-5.html">Home - 5</a>
</li>
<li>
<a class="dropdown-item" href="home-6.html">Home-6</a>
</li>
<li>
<a class="dropdown-item" href="home-7.html">Home - 7</a>
</li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="javascript:;" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Pages </a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="inner-knowledgebase.html">Knowledgebase</a>
</li>
<li>
<a class="dropdown-item" href="inner-faq.html">FAQ</a>
</li>
 <li>
<a class="dropdown-item" href="inner-login.html">Login</a>
</li>
<li>
<a class="dropdown-item" href="inner-signup.html">Signup</a>
</li>
<li>
<a class="dropdown-item" href="inner-recover-account.html">Recover Account</a>
</li>
<li>
<a class="dropdown-item" href="inner-coming-soon.html">Coming Soon</a>
</li>
<li>
<a class="dropdown-item" href="inner-404.html">Error 404</a>
</li>
<li>
<a class="dropdown-item" href="inner-maintenance.html">Maintenance</a>
</li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="javascript:;" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Blog </a>
<ul class="dropdown-menu">
<li class="dropdown-submenu"><a class="dropdown-item dropdown-toggle" href="javascript:;">Blog Pages</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="blog-grid-2-col.html">Blog Grid 2 Column</a>
</li>
<li>
<a class="dropdown-item" href="blog-grid-3-col.html">Blog Grid 3 Column</a>
</li>
<li>
<a class="dropdown-item" href="blog-grid-2-col-sidebar-left.html">Blog Sidebar Left</a>
</li>
<li>
<a class="dropdown-item" href="blog-grid-2-col-sidebar-right.html">Blog Sidebar right</a>
</li>
</ul>
</li>
<li class="dropdown-submenu"><a class="dropdown-item dropdown-toggle" href="javascript:;">Blog Details</a>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item" href="blog-details-full.html">Blog Details Full</a>
</li>
<li>
<a class="dropdown-item" href="blog-details-sidebar-right.html">Blog Details Sidebar Right</a>
</li>
<li>
<a class="dropdown-item" href="blog-details-sidebar-left.html">Blog Details Sidebar Left</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="http://docs.tunerpixel.com/spacemax/">Documentation</a>
</li>
</ul>

</nav>
</div>
 <div class="mr-5 mr-lg-0 ml-lg-2">
<a href="#" class="btn btn-size--sm btn-border btn-hover--splash color--white"><span class="btn__text font-w--500">Get Started</span></a>
</div>

</div>

</header>


<section class="hero hero--full hero--v9 bg-color--primary d-flex align-items-center hidden">
<div class="canvas-lines opacity--10">
<span></span>
<span></span>
<span></span>
<span></span>
</div>

<div class="container">
<div class="row flex-column-reverse flex-lg-row">
<div class="col-12 col-md-10 col-lg-7 mx-auto mx-lg-0 text-center text-lg-left z-index2">
<div class="hero-content reveal">
<h1 class="hero__title mb-2 mb-lg-3">Access the
<br> power of blockchain</h1>
<p class="hero__description font-size--20 mb-3 mb-lg-5 pr-xl-10">Computers have become ubiquitous in almost every facet of our lives. At work, desk jockeys spend.</p>

<a href="#" class="btn btn-bg--cta--3 btn-hover--3d">
<span class="btn__text"> <i class="fab fa-github pr-1"></i> Download SpaceMax</span>
</a>

</div>

<div class="features features--v2 color--white d-flex justify-content-center justify-content-lg-start flex-wrap remove-space--x mt-4 mt-lg-8 reveal">
<div class="single-item m-1 m-sm-4">
<span class="h2-font">
<i class="icon icon-key"></i>
</span>
<p class="h4-font">Access</p>
</div>

<div class="single-item m-1 m-sm-4">
<span class="h2-font">
<i class="icon icon-metrics"></i>
</span>
<p class="h4-font">Speed</p>
</div>

<div class="single-item m-1 m-sm-4">
<span class="h2-font">
<i class="icon icon-handshake"></i>
</span>
<p class="h4-font">Certainty</p>
</div>

<div class="single-item m-1 m-sm-4">
<span class="h2-font">
<i class="icon icon-money-bag"></i>
</span>
<p class="h4-font">Cost</p>
</div>

</div>
</div>

<div class="col-12 col-lg-6 mt-6 mt-lg-0 mb-2 mb-lg-0 pl-lg-4 pos-abs-lg-vertical-center pos-right hero__image">
<picture><img src="img/hero-9.png" alt="media-thumb" class="img-fluid"></picture>
</div>

</div>

</div>
</section>

 
<section class="bg-color--primary features features--v1 pt-10 pb-5 hidden" id="features">
<div class="canvas-lines opacity--10">
<span></span>
<span></span>
<span></span>
<span></span>
</div>

<div class="container">
<div class="row">
<div class="col-12 col-md-10 col-lg-5">
<div class="section-title mb-5 mb-lg-7 text-center text-md-left reveal">
<h2 class="h3-font">Build and deploy <br>blockchain applications <br> with speed.
</h2>
</div>
</div>
</div>

<div class="row">
<div class="col-12">
<div class="masks">
<div class="mask mask--top z-index2 jsElement bg-color--primary" data-height="50%"></div>
<div class="mask mask--bottom z-index3 bg-color--primary-light--1 jsElement" data-height="72.7%"></div>
<div class="mask mask--full bg-color--primary-light--1 jsElement" data-height="72.7%"></div>

</div>

<div class="carosuel-slider--v3 card--v3 z-index1">
<div class="slide">
<div class="card bg-color--primary rounded--05 box-shadow--6 px-3 pt-5 pb-3">
<div class="card-body">
<span class="font-size--60 mb-2 color--white">
<i class="icon icon-contacts"></i>
</span>
<h3 class="font-size--30 font-w--700 mb-2"><a href="#" class="color--white">Smart <br> Contracts</a></h3>
<p class="mb-3 font-size--20 opacity--80">Computers have become ubiquitous in almost every facet of our lives. At work, desk jockeys spend.</p>
</div>
<div class="card-footer">
<a href="#" class="font-size--26 color--white"><i class="icon icon-arrow-right"></i></a>
</div>
</div>
</div>

<div class="slide active">
<div class="card bg-color--primary rounded--05 box-shadow--6 px-3 pt-5 pb-3">
<div class="card-body">
<span class="font-size--60 mb-2 color--white">
<i class="icon icon-tool-blur"></i>
</span>
<h3 class="font-size--30 font-w--700 mb-2"><a href="#" class="color--white">State <br> Channels</a></h3>
<p class="mb-3 font-size--20 opacity--80">Computers have become ubiquitous in almost every facet of our lives. At work, desk jockeys spend.</p>
 </div>
<div class="card-footer">
<a href="#" class="font-size--26 color--white"><i class="icon icon-arrow-right"></i></a>
</div>
</div>
</div>

<div class="slide">
<div class="card bg-color--primary rounded--05 box-shadow--6 px-3 pt-5 pb-3">
<div class="card-body">
<span class="font-size--60 mb-2 color--white">
<i class="icon icon-meeting"></i>
</span>
<h3 class="font-size--30 font-w--700 mb-2"><a href="#" class="color--white">Unique <br> Governance</a></h3>
<p class="mb-3 font-size--20 opacity--80">Computers have become ubiquitous in almost every facet of our lives. At work, desk jockeys spend.</p>
</div>
<div class="card-footer">
<a href="#" class="font-size--26 color--white"><i class="icon icon-arrow-right"></i></a>
</div>
</div>
</div>

<div class="slide">
<div class="card bg-color--primary rounded--05 box-shadow--6 px-3 pt-5 pb-3">
<div class="card-body">
<span class="font-size--60 mb-2 color--white">
<i class="icon icon-app-store"></i>
</span>
<h3 class="font-size--30 font-w--700 mb-2"><a href="#" class="color--white">Oracles</a></h3>
<p class="mb-3 font-size--20 opacity--80">Computers have become ubiquitous in almost every facet of our lives. At work, desk jockeys spend.</p>
</div>
<div class="card-footer">
<a href="#" class="font-size--26 color--white"><i class="icon icon-arrow-right"></i></a>
</div>
</div>
</div>

<div class="slide">
<div class="card bg-color--primary rounded--05 box-shadow--6 px-3 pt-5 pb-3">
<div class="card-body">
<span class="font-size--60 mb-2 color--white">
<i class="icon icon-handshake"></i>
</span>
<h3 class="font-size--30 font-w--700 mb-2"><a href="#" class="color--white">Consensus</a></h3>
<p class="mb-3 font-size--20 opacity--80">Computers have become ubiquitous in almost every facet of our lives. At work, desk jockeys spend.</p>
</div>
<div class="card-footer">
<a href="#" class="font-size--26 color--white"><i class="icon icon-arrow-right"></i></a>
</div>
</div>
</div>

</div>
</div>
</div>
</div>
</section>


<section class="space--bottom pt-5 pt-lg-9 bg-color--primary-light--1 testimonials testimonials--v2">
<div class="container">
<div class="row">
<div class="col-12 col-md-10 mx-auto reveal">
<div class="testimonials__pattern background-holder background--auto background--top--left opacity--40">
<img src="img/layout/vertical-pattern-1.png" alt="wave" class="background-image-holder">
</div>

<div class="carosuel-slider--v7 testimonial bg-white border--around rounded--10">
<div class="slide">
<div class="d-md-flex p-3 py-lg-5 pl-lg-4 pr-lg-10">
<span class="testimonial__quote color--coral mr-3"><i class="icon icon-quote"></i></span>
<div>
<blockquote class="blockquote mb-3">SpaceMax is designed to pioneer the plasma architecture, the leading scalability network is a stakeholder and infinitelyis a stakeholder and infinitelyis a stakeholder and infinitely scalable blockchain for plasma.
Quisque ac dolor nec nisl pell entesque ullan mor. Vestibu um sed per ultrices mi etamor. Amcorper uique ac do lo nec nis im pites mane.</blockquote>
<div class="d-flex align-items-center">
<span class="mr-2"><img src="img/avatar-1.png" alt="avatar"></span>
<div class="d-flex flex-column">
<span class="client-name font-size--17 font-w--600">Loretta Paul</span>
<span>Themeforest</span>
</div>
</div>
</div>
</div>
</div>

<div class="slide">
<div class="d-md-flex p-3 py-lg-5 pl-lg-4 pr-lg-10">
<span class="testimonial__quote color--coral mr-3"><i class="icon icon-quote"></i></span>
<div>
<blockquote class="blockquote mb-3">SpaceMax is designed to pioneer the plasma architecture, the leading scalability network is a stakeholder and infinitely scalable blockchain for plasma. Quisque ac dolor nec nisl pell entesque ullan mor. Vestibu
um sed per ultrices mi etamor. Amcorper uique ac do lo nec nis im pites mane.</blockquote>
<div class="d-flex align-items-center">
<span class="mr-2"><img src="img/avatar-2.png" alt="avatar"></span>
<div class="d-flex flex-column">
<span class="client-name font-size--17 font-w--600">Jimmy Griffin</span>
<span>Themeforest</span>
</div>
</div>
</div>
</div>
</div>

<div class="slide">
<div class="d-md-flex p-3 py-lg-5 pl-lg-4 pr-lg-10">
<span class="testimonial__quote color--coral mr-3"><i class="icon icon-quote"></i></span>
<div>
<blockquote class="blockquote mb-3">SpaceMax is designed to pioneer the plasma architecture, the leading scalability network is a stakeholder and infinitely scalable blockchain for plasma. Quisque ac dolor nec nisl pell entesque ullan mor. Vestibu
um sed per ultrices mi etamor. Amcorper uique ac do lo nec nis im pites mane.</blockquote>
<div class="d-flex align-items-center">
<span class="mr-2"><img src="img/avatar-3.png" alt="avatar"></span>
<div class="d-flex flex-column">
<span class="client-name font-size--17 font-w--600">Alan Rogers</span>
<span>Themeforest</span>
</div>
</div>
</div>
</div>
</div>

</div>
</div>
</div>
</div>
</section>


<section class="space--bottom pt-7 pt-md-3 pt-lg-0 bg-color--primary-light--1 intro-video--v1">
<div class="svg-shape ">
<img src="img/layout/wave-5.svg" alt="wave" class="svg">
</div>
<div class="container">
<div class="row position-relative reveal">
<div class="about-video__pattern background-holder background--top--right opacity--50">
<img src="img/layout/vertical-pattern-1.svg" alt="dots-pattern" class="background-image-holder">
</div>

<div class="col-12 col-lg-9">
<div class="bg-color--primary text-center text-lg-left p-5 p-lg-8 box-shadow--2 position-relative z-index1">
<div class="background-holder background--cover background--left z-index-1">
<img src="img/layout/video-bg-1.png" alt="wave" class="background-image-holder">
</div>

<h2>Advancing<br> Blockchain<br>Technology</h2>
</div>
</div>
<div class="col-12 col-lg-7 col-xl-8 ml-auto about-video-media">
<picture><img src="img/media-thumb-4.png" alt="media-thumb" class="img-fluid box-shadow--2"></picture>
<a class="lightbox pos-abs-center" data-autoplay="true" data-vbtype="video" href="https://www.youtube.com/watch?v=aRh_eUQSmIg">
<span class="btn btn-media btn-media-size--lg btn-bg--cta--3 rounded--full box-shadow--3"><i class="icon icon-triangle-right"></i></span>
</a>
</div>
</div>
</div>
</section>


<section class="space" id="why">
<div class="container">
<div class="row space--bottom flex-column-reverse flex-lg-row align-items-center text-center">
<div class="col-12 col-md-10 col-lg-6 text-lg-left reveal">
<h2 class="mb-3">Design and issue your own cryptocurrency</h2>
<p class="mb-5">SpaceMax is designed to pioneer the plasma architecture, the leading scalability solution for Ethereum Layer 2. The SpaceMax network is a stakeholder and infinitely scalable blockchain for plasma with a decentralized exchange built
into its core consensus layer.</p>
<a href="#" class="btn btn-bg--cta--3">
<span class="btn__text d-flex align-items-center"> Start integrating <i class="icon icon-arrow-right font-size--20"></i>
</span>
</a>
</div>

<div class="col-12 col-lg-6 mb-3 mb-lg-0">
<picture>
<img class="img-fluid" src="img/illustration-09.png" alt="illustration">
</picture>
</div>

</div>

<div class="row flex-column-reverse flex-lg-row-reverse align-items-center text-center">
<div class="col-12 col-md-10 col-lg-6 text-lg-left reveal">
<h2 class="mb-3">Start a project with a trustless crowdsale</h2>
<p class="mb-5">SpaceMax is designed to pioneer the plasma architecture, the leading scalability solution for Ethereum Layer 2. The SpaceMax network is a stakeholder and infinitely scalable.</p>
<a href="#" class="btn btn-bg--cta--3">
<span class="btn__text d-flex align-items-center"> Start your project <i class="icon icon-arrow-right font-size--20"></i>
</span>
</a>
</div>

<div class="col-12 col-lg-6 mb-3 mb-lg-0">
<picture>
<img class="img-fluid" src="img/illustration-10.png" alt="illustration">
</picture>
</div>

</div>

</div>
</section>


<section class="space--bottom bg-color--primary hidden" id="developer">
<div class="svg-shape--top w-100 z-index1">
<img src="img/layout/mask-9.svg" alt="mask" class="svg w-100">
</div>

<div class="svg-shape">
<img src="img/layout/wave-6.svg" alt="wave" class="svg">
</div>

<div class="container position-relative z-index2">
<div class="row mb-3 mb-lg-8">
<div class="col-12">
<picture>
<img class="img-fluid" src="img/macbook-air.png" alt="device">
</picture>
</div>
</div>

<div class="row">
<div class="col-12 col-lg-6 mb-3 mx-auto text-center reveal">
<div class="section-title">
<h2 class="mb-2">Technology we use</h2>
<p>We have used most advnaced technology and programming language which will make everything easy for developers. </p>
</div>
</div>
</div>

<div class="row">
<div class="col-12 text-center">
<div class="border--bottom pb-5 reveal">
<span class="m-2 m-lg-4"><img src="img/react-logo.png" alt="logo"></span>
<span class="m-2 m-lg-4"><img src="img/ruby-logo.png" alt="logo"></span>
<span class="m-2 m-lg-4"><img src="img/js-logo.png" alt="logo"></span>
<span class="m-2 m-lg-4"><img src="img/paython-logo.png" alt="logo"></span>
<span class="m-2 m-lg-4"><img src="img/github-logo.png" alt="logo"></span>
</div>
 </div>
</div>

<div class="row flex-column-reverse flex-lg-row align-items-center text-center mb-lg-2 mt-6 mt-lg-9">
<div class="col-12 col-md-10 col-lg-5 text-lg-left reveal">
<h2 class="mb-3">If you are a developer</h2>
<p class="mb-5">Welcome to participate in our projects, claim a reward or view more technical documents. We have used most advnaced technology and programming language which will make everything easy for developers.</p>
<a href="#" class="btn btn-bg--cta--3">
<span class="btn__text d-flex align-items-center">Start integrating<i class="icon icon-arrow-right font-size--20"></i>
</span>
</a>
</div>

<div class="col-12 col-lg-6 ml-auto mb-8 mb-lg-0 reveal">
<div class="overlap-image--v1 position-relative">
<picture class="overlap-image__main">
<img class="img-fluid rounded--08 box-shadow--5" src="img/screen-2.1.png" alt="screen">
</picture>
<picture class="overlap-image__secondary pos-abs-bottom-right">
<img class="img-fluid box-shadow--5 rounded-circle" src="img/screen-2.2.png" alt="screen">
</picture>
</div>
</div>

</div>

</div>

</section>


<section class="pt-8 pb-6 pt-lg-8 pb-lg-7 bg-color--primary-light--1 upcoming-events--v1" id="events">
<div class="container">
<div class="row position-relative pt-lg-5">
<div class="background-holder background--top--left opacity--30">
<img src="img/layout/map-3.png" alt="map" class="background-image-holder">
</div>

<div class="col-12 col-md-10 col-lg-6">
<div class="section-title text-center text-md-left pb-7 reveal">
<div class="section-title">
<h2 class="h3-font mb-2">Upcoming Events</h2>
<p>SpaceMax is designed to pioneer the plasma architecture, the leading scalability solution. The network is a stakeholder and infinitely scalable blockchain for plasma.</p>
</div>
</div>
</div>
</div>

<div class="row d-block reveal">

<div class="carosuel-slider--v4">
<div class="slide">
<div class="card bg-white rounded--05 box-shadow--3">
<div class="card-body mb-3">
<a href="#" class="font-size--30 color--primary">Abu Dhabi</a>
<span class="d-block mb-1 font-size--14">21-22 March 2019</span>
<a href="#" class="btn btn--transparent text-color--700">
<span class="font-size--14 d-flex align-items-center">
See Details
<i class="icon icon-arrow-right"></i>
</span>
 </a>
</div>
<picture>
<img class="img-fluid" src="img/event-place-1.png" alt="place">
</picture>
</div>
</div>

<div class="slide">
<div class="card bg-white rounded--05 box-shadow--3">
<div class="card-body mb-3">
<a href="#" class="font-size--30 color--primary">Riyadh</a>
<span class="d-block mb-1 font-size--14">08-11 June 2019</span>
<a href="#" class="btn btn--transparent text-color--700">
<span class="font-size--14 d-flex align-items-center">
See Details
<i class="icon icon-arrow-right"></i>
</span>
</a>
</div>
<picture>
<img class="img-fluid" src="img/event-place-2.png" alt="place">
</picture>
</div>
</div>

<div class="slide">
<div class="card bg-white rounded--05 box-shadow--3">
<div class="card-body mb-3">
<a href="#" class="font-size--30 color--primary">Dubai</a>
<span class="d-block mb-1 font-size--14">15-18 September 2019</span>
<a href="#" class="btn btn--transparent text-color--700">
<span class="font-size--14 d-flex align-items-center">
See Details
<i class="icon icon-arrow-right"></i>
</span>
</a>
</div>
<picture>
<img class="img-fluid" src="img/event-place-3.png" alt="place">
</picture>
</div>
</div>

<div class="slide">
<div class="card bg-white rounded--05 box-shadow--3">
<div class="card-body mb-3">
<a href="#" class="font-size--30 color--primary">Kuwait City</a>
<span class="d-block mb-1 font-size--14">21-22 January 2020</span>
<a href="#" class="btn btn--transparent text-color--700">
<span class="font-size--14 d-flex align-items-center">
See Details
<i class="icon icon-arrow-right"></i>
</span>
</a>
</div>
<picture>
<img class="img-fluid" src="img/event-place-4.png" alt="place">
</picture>
</div>
</div>

<div class="slide">
<div class="card bg-white rounded--05 box-shadow--3">
<div class="card-body mb-3">
<a href="#" class="font-size--30 color--primary">Bagdhad</a>
<span class="d-block mb-1 font-size--14">15-18 March 2020</span>
<a href="#" class="btn btn--transparent text-color--700">
<span class="font-size--14 d-flex align-items-center">
See Details
<i class="icon icon-arrow-right"></i>
</span>
</a>
</div>
<picture>
<img class="img-fluid" src="img/event-place-5.png" alt="place">
</picture>
</div>
</div>

</div>
</div>

</div>
</section>


<section class="space--bottom bg-color--primary-light--1 ">
<div class="container">
<div class="row justify-content-center reveal">
<div class="col-12 col-lg-5 mb-2">
<div class="card card--double card-hover--shadow">
<div class="card-body px-3 py-4">
<a href="#" class="text-color--700 text-hover--primary font-w--500 h5-font mb-2">Facts Why Inkjet Printing Is Very Appealing Compared Ordinary Printing</a>
<a href="#" class="btn btn-size--md btn--transparent color--primary">
<span class="btn__text p-0"> Read the news <i class="icon icon-arrow-right"></i>
</span>
</a>
</div>
</div>
</div>

<div class="col-12 col-lg-5 mb-2">
<div class="card card--double bg-white card-hover--shadow">
<div class="card-body px-3 py-4">
<a href="#" class="text-color--700 text-hover--primary font-w--500 h5-font mb-2">5 Reasons To Purchase Desktop Computers</a>
<a href="#" class="btn btn-size--md btn--transparent color--primary">
<span class="btn__text p-0"> Read the news <i class="icon icon-arrow-right"></i>
</span>
</a>
</div>
</div>
</div>

</div>
</div>
</section>


<section class="bg-color--primary hidden">
<div class="svg-shape--top w-100">
<img src="img/layout/wave-7.svg" alt="wave" class="svg w-100">
</div>

<div class="space--bottom position-relative">
<div class="container">
<div class="row justify-content-between align-items-center">
<div class="col-12 col-md-7 col-lg-6 mb-3 mb-lg-0 mx-auto mx-md-0">
<picture>
<img class="img-fluid" src="img/newsletter-illustrator-1.png" alt="newsletter-illustrator">
</picture>
</div>

<div class="col-12 col-sm-8 col-lg-5 pl-lg-0 mx-auto">
<div class="newsletter-form form--v2 border--around bg-white rounded--10 box-shadow--3 text-center px-3 pb-5">
<div class="pt-4 pb-5">
<h2 class="h3-font mb-1">Subscribe our newsletter</h2>
<p class="text-color--400">By subscribing our newsletter you will know all the latest updates about blockchain from us.</p>
</div>

<form action="#" class="form">
<div class="input-group d-flex">
<input type="email" class="form-control" placeholder="Enter your email" required>
<button class="btn btn-hover--splash btn-bg--cta--3" type="submit"><span class="btn__text"><i class="icon icon-arrow-right"></i></span></button>
</div>
</form>

</div>
</div>

</div>

</div>

</div>

<footer class="section--dark footer footer--v1 position-relative">
<div class="container text-center">
<div class="row">
<div class="col-12 mb-2">
<span class="mb-2">
<img src="img/brand-logo-white.png" alt="brand-logo">
</span>
<div class="widget widget-nav">
<ul>
<li><a href="#">Download</a></li>
<li><a href="#">Privacy Policy</a></li>
<li><a href="#">Terms of Use</a></li>
<li><a href="#">Whitepaper</a></li>
<li><a href="#">News</a></li>
</ul>
</div>

</div>

</div>

<div class="row">
<div class="col-12">
<div class="footer-border py-3">
<ul class="icon-group icon--2x justify-content-center mb-0">
<li class="p-2"><a href="#" class="color--white"><i class="fab fa-medium-m"></i></a></li>
<li class="p-2"><a href="#" class="color--white"><i class="fab fa-facebook-f"></i></a></li>
<li class="p-2"><a href="#" class="color--white"><i class="fab fa-twitter"></i></a></li>
<li class="p-2"><a href="#" class="color--white"><i class="fab fa-linkedin-in"></i></a></li>
<li class="p-2"><a href="#" class="color--white"><i class="fab fa-telegram-plane"></i></a></li>
<li class="p-2"><a href="#" class="color--white"><i class="fab fa-github"></i></a></li>
<li class="p-2"><a href="#" class="color--white"><i class="fab fa-youtube"></i></a></li>
<li class="p-2"><a href="#" class="color--white"><i class="fab fa-pinterest"></i></a></li>
<li class="p-2"><a href="#" class="color--white"><i class="fab fa-instagram"></i></a></li>
<li class="p-2"><a href="#" class="color--white"><i class="fab fa-gitter"></i></a></li>
<li class="p-2"><a href="#" class="color--white"><i class="fab fa-discord"></i></a></li>
 </ul>
</div>

</div>

</div>

<div class="row">
<div class="col-12">
<div class="footer-bottom pt-5 pb-3 d-lg-flex justify-content-between">
<p class="mb-1">© <a href="#">example</a> 2019 | All rights reserved</p>
<a class="mb-2 mb-lg-1" href="#"><span class="__cf_email__" data-cfemail="2c4f4342584d4f586c49544d415c4049024f4341">[email&#160;protected]</span></a>
<ul class="footer-languages list-unstyled d-flex justify-content-center">
<li><a href="#">English</a></li>
<li><a href="#">中文 (简体)</a></li>
<li><a href="#">বাংলা</a></li>
<li><a href="#">русский язык</a></li>
<li><a href="#">العَرَبِيَّة</a></li>
</ul>
</div>

</div>

</div>

</div>

</footer>
</section>

</main>
<script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script src="js/plugins.min.js"></script>
<script src="js/app.js"></script>
</body>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-125821150-2');
</script>
</html>